import { fileURLToPath, URL } from "node:url";
import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import Unocss from "unocss/vite";

import pxtorem from "postcss-pxtorem";

// https://vite.dev/config/
export default defineConfig(({ command, mode }) => {
  const env = loadEnv(mode, process.cwd());
  return {
    css: {
      postcss: {
        plugins: [
          pxtorem({
            rootValue: 192, // UI设计稿的宽度/10
            unitPrecision: 3, // 转rem精确到小数点多少位
            propList: ["*"], // 需要转换的属性 *表示所有
            selectorBlackList: ["ignore"], // 不进行px转换的选择器
            replace: true, // 是否直接更换属性值，而不添加备用属性
            mediaQuery: false, // 是否在媒体查询的css代码中也进行转换
            minPixelValue: 0, // 设置要替换的最小像素值
            // exclude: /src\/views\/pc/ // 排除node_modules文件夹下的文件
          }),
        ],
      },
    },
    plugins: [vue(), Unocss()],
    build: {
      rollupOptions: {
        output: {
          // 配置 CSS 资源存放路径
          assetFileNames: (assetInfo) => {
            const ext = assetInfo.names?.pop()?.split(".").pop();

            if (["png", "jpg", "jpeg", "gif", "svg", "webp"].includes(ext)) {
              return "images/[name]-[hash][extname]"; // 图片存放在 images 目录
            }
            return "[name]-[hash][extname]"; // 其他静态资源
          },
        },
      },
    },
    server: {
      host: "0.0.0.0",
      port: 8080,
      cors: true,
      open: false,
      hmr: {
        overlay: false,
      },
      proxy: {
        "http://47.92.7.178": {
          target: "http://47.92.7.178",
          changeOrigin: true,
        },
      },
    },
    resolve: {
      alias: {
        "@": fileURLToPath(new URL("./src", import.meta.url)),
      },
    },
  };
});
